<template>
	<view class="warp">
		<view class="textbox fillet">
			<input v-model="formdata.TrueName" type="text" placeholder-class="placeholderStyle" placeholder="填写教练姓名 " maxlength="10" />
			<!-- <textarea v-model="formdata.Resume"
				placeholder-style="font-size: 28rpx;line-height: 1.6;color:#C2C2C2;font-weight: 400;"
				placeholder="请介绍一下自己，例如：获得的荣誉证书、称号、执教经验等~"></textarea> -->
			<!-- <EditorBox  ref="child"></EditorBox> -->
			<!-- <view class="group_textarea">
				<textarea style="width: 100%;height: 80%; font-weight: 400;" 
						:value="formdata.Resume" placeholder="请介绍一下自己，例如：获得的荣誉证书、称号、执教经验等~" placeholder-class="remtext" maxlength="200" @input="inputrem" />
				<view class="count">{{ formdata.Resume.length }} / {{ maxCount }}</view>
			</view> -->

		</view>
		<view class="checkbox fillet">
			<view class="check_item">
				<view class="tit">联系电话</view>
				<view class="check_content">
					<input v-model="formdata.Phone" class="lit" type="tel" placeholder="请输入联系电话" maxlength="11"/>
				</view>
				<!-- #ifdef MP-WEIXIN -->
				<button class="s_btn" open-type="getPhoneNumber" @getphonenumber="getNums">
					绑定手机
				</button>
				<!-- #endif -->
			</view>
			<view class="check_item" @click="showmlevel = true" :style="formdata.Level?'border-bottom: 0;':''">
				<view class="tit">等级选择</view>
				<view class="check_content">
					<input type="text" :value="formdata.Level" disabled placeholder="请选择"
						placeholder-class="cheStyle" />
				</view>
				<view class="icon_box">
					<uni-icons type="right" size="16" color="#E7E7E7"></uni-icons>
				</view>
			</view>
			<view class="leveltext" v-if="formdata.Level">
				{{levelobj[0].Code+'：'+levelobj[0].ValueStr}}
			</view>
			<!-- <view class="check_item" @click="isskill">
					<view class="tit">擅长项目</view>
					<view class="check_content">
						<input type="text" :value="formdata.Skills" disabled placeholder="请选择"
							placeholder-class="cheStyle" />
					</view>
					<view class="icon_box">
						<uni-icons type="right" size="16" color="#E7E7E7"></uni-icons>
					</view>
			</view> -->
			<!-- <view class="check_item" @click="openMap">
				<view class="tit">常驻场地</view>
				<view class="check_content">
					<view :class="['lit', address ? '' : 'gary']">{{ address ? address : '请选择执教场地' }}</view>
					<uni-icons size="16" color="#C7C7C7" type="right"></uni-icons>
				</view>
			</view> -->
			<view class="check_item" @click="showBirthday = true">
				<view class="tit">生日</view>
				<view class="check_content">
					<input type="text" v-model="formdata.Birthday" disabled placeholder="选择生日" />
				</view>
				<view class="icon_box"><uni-icons type="right" size="16" color="#E7E7E7"></uni-icons></view>
			</view>
			<view class="check_item" @click="isSex = true">
				<view class="tit">性别</view>
				<view class="check_content">
					<input type="text" :value="formdata.Sex" disabled placeholder="请选择"
						placeholder-class="cheStyle" />
				</view>
				<view class="icon_box">
					<uni-icons type="right" size="16" color="#E7E7E7"></uni-icons>
				</view>
			</view>
			<view class="check_item">
				<view class="tit">体重(kg)</view>
				<view class="check_content" style="margin-right: 18rpx;">
					<input type="text" maxlength="3" v-model="formdata.Weight"  placeholder="请输入"
						placeholder-class="cheStyle" />
				</view>
				<!-- <view class="icon_box">
					<uni-icons type="right" size="16" color="#E7E7E7"></uni-icons>
				</view> -->
			</view>
			<view class="check_item">
				<view class="tit">身高(cm)</view>
				<view class="check_content" style="margin-right: 18rpx;">
					<input type="text" maxlength="3" v-model="formdata.Height"  placeholder="请输入"
						placeholder-class="cheStyle" />
				</view>
				<!-- <view class="icon_box">
					<uni-icons type="right" size="16" color="#E7E7E7"></uni-icons>
				</view> -->
			</view>
			<!-- <view class="check_item">
				<view class="tit">常驻城市</view>
				<view class="check_content" @click="toSelectCity">
					<input type="text" :value="formdata.City" disabled placeholder="请选择"
						placeholder-class="cheStyle" />
				</view>
				<view class="icon_box">
					<uni-icons type="right" size="16" color="#E7E7E7"></uni-icons>
				</view>
			</view> -->
			<view class="check_item" @click="isConstell = true">
				<view class="tit">工作类型</view>
				<view class="check_content">
					<input type="text" :value="formdata.WorkType" disabled placeholder="请选择"
						placeholder-class="cheStyle" />
				</view>
				<view class="icon_box">
					<uni-icons type="right" size="16" color="#E7E7E7"></uni-icons>
				</view>
			</view>
			<view class="check_item" @click="isskill">
				<view class="tit">擅长项目</view>
				<view class="check_content">
					<input type="text" :value="formdata.Skills" disabled placeholder="请选择"
						placeholder-class="cheStyle" />
				</view>
				<view class="icon_box">
					<uni-icons type="right" size="16" color="#E7E7E7"></uni-icons>
				</view>
			</view>
		</view>
		<block v-if=" formdata.Skills && formdata.Skills.split(',').length > 0">
				<view style="background-color: #fff;padding: 0 32rpx;padding-bottom: 100rpx;padding-top: 30rpx;" v-for="(item,index) in formdata.Skills.split(',')" :key="index">
					<view class="skname">{{item}}</view>
					<!-- 视频 视频播放器 -->
					<view class="img_list">
						<view class="title">{{'教练视频'}}</view>
						<view @click="selectImg_MP(index)" class="img addimg" v-if="!newlist[index].Video">
							<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/17104950296621296.png" mode=""></image>
						</view>
						<view v-else  class="video_box" :style="'height:' + vHight + 'rpx;width:' + vWidth + 'rpx'">
							<video id="myVideo" :src="newlist[index].Video" :style="'height:' + vHight + 'rpx;width:' + vWidth + 'rpx'"
							></video>
							<view class="del_con" @click.stop="delvideo(index)">
								<uni-icons type="closeempty" color="#fff" size="16"></uni-icons>
							</view>
							<!-- <view class="pro" v-if="localList[0].pro != 100">
								已上传:{{ localList[0].pro + "%" }}
							</view> -->
						</view>
					</view>

					<view class="img_list">
						<view class="title">{{'教练靓照(至少传三张)'}}</view>
						<view class="img_box">
								<view class="img" v-for="(value, i) in newlist[index].Imglist" :key="i">
									<image :src="value" mode="aspectFill"></image>
									<view class="icon" @click.stop="delImg(index,i)">
										<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/1710154762492571.png" mode=""></image>
									</view>
								</view>
						<!-- #ifdef MP-WEIXIN -->
						<view class="img addimg" @tap="upload(index)" v-if=" newlist[index].Imglist && newlist[index].Imglist.length < 9">
									<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/17104950296621296.png" mode=""></image>
						</view>
						<!-- #endif -->
						<!-- #ifdef APP-PLUS -->
						<view class="img addimg" @tap="selectImg_APP" v-if=" newlist[index].Imglist && newlist[index].Imglist.length < 9">
									<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/17104950296621296.png" mode=""></image>
								</view>
						<!-- #endif -->
						</view>
					</view>
					<view class="skillbox">
						<view class="tit">服务项目</view>
						<view class="check_content" @click="openServeBox(index)">
						<view class="addserve">添加</view>
						</view>
						<!-- <view class="icon_box">
							<uni-icons type="right" size="16" color="#E7E7E7"></uni-icons>
						</view> -->
					</view>
					<block v-if="newlist[index].ServerListStr.length > 0">
						<view v-for="(ivalue,i) in newlist[index].ServerListStr" :key="i" class="contentbox">
							<image class="icon" :src="ivalue.Images"></image>
							<view class="titlebox">
								<view class="title">{{ ivalue.ProductName }}</view>
								<view class="fee">{{ ivalue.Price }}/小时</view>
							</view>
							<view class="reservabtn" @click="DeleteServer(index,i)">
									删除服务
							</view>
						</view>
					</block>
				</view>
			</block>


		<!-- <block v-if="serverlist.length > 0">
			<view v-for="(item,index) in serverlist" :key="index" class="contentbox">
				<image class="icon" :src="item.Images"></image>
				<view class="titlebox">
					<view class="title">{{ item.ProductName }}</view>
					<view class="fee">{{ item.Price }}/小时</view>
				</view>
				<view class="reservabtn" @click="DeleteServer(index)">
						删除服务
				</view>
			</view>
		</block> -->
		<view style="height: 130rpx"></view>
		<view class="btn_box" @click="judGment">
			<view class="go_btn">申请入驻</view>
		</view>

		<uni-popup ref="popup" type="bottom">
			<view class="popupbox">
				<view class="title">选择就职场地</view>
				<view class="sear">
					<view class="icon">
						<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/17105828891391238.png" mode="">
						</image>
					</view>
					<input type="text" v-model="searchVal" placeholder="请输入场地名称" @input="searchFun" />
					<view class="icon" @click="clearSearch">
						<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/17105829170081077.png" mode="">
						</image>
					</view>
				</view>
				<scroll-view class="scroll" scroll-y @scrolltolower="scrolltolower">
					<view v-if="searchArr.length">
						<view class="item" v-for="item in searchArr" :key="item.ID" @click="tapShop(item)">
							【{{ item.City }}】{{ item.ShopName }}
						</view>
					</view>
					<view class="item" v-else
						style="height: 100%; display: flex; align-items: center; justify-content: center">
						暂无该场地信息
					</view>
				</scroll-view>
			</view>
		</uni-popup>
		<!-- 运动项目 -->
		<u-picker :show="showmotion" immediateChange @confirm="setmotion" @cancel="showmotion = false"
			:columns="motiontype"></u-picker>
		<!-- 等级列表 -->
		<u-picker :show="showmlevel" immediateChange @confirm="setlevel" @cancel="showmlevel = false"
			:columns="leveList"></u-picker>
		<!-- 性别 -->
		<u-picker :show="isSex" immediateChange @confirm="setSex" @cancel="isSex = false"
			:columns="sexList"></u-picker>
		<!-- 工作类型 -->
		<u-picker :show="isConstell" immediateChange @confirm="setConstell" @cancel="isConstell = false"
			:columns="ConstellList"></u-picker>
		<!-- 生日 -->
		<u-datetime-picker immediateChange ref="datetimePicker" @cancel="showBirthday = false" :show="showBirthday"
			:minDate="minDate" :maxDate="maxDate" mode="date" v-model="nowDate"
			@confirm="setBirthday"></u-datetime-picker>	
		<uni-popup ref="gift" type="center">
			<view class="sporttext"
				>擅长项目：<text class="maxtag">{{ "(最多选择三个技能)" }}</text></view
			>
			<view class="sportbox">
				<view
				@click="skitype(item.Code, item.checked)"
				class="sport"
				v-for="(item, index) in sportList"
				:key="index"
				:class="item.checked ? 'text4' : ''"
				>
				{{ item.Code }}
				</view>
			</view>
		</uni-popup>

		<uni-popup ref="serveBox" type="center">
			<view class="bottombox">
			<view class="group_2" >
				<view class="lab">{{ '运动项目' }}</view>
				<view class="inp_box">
				<input type="text" :value="fuwuData.Type" disabled placeholder="请选择" />
				</view>
				<!-- <view class="icon_box">
				<uni-icons type="right" size="20" color="#E7E7E7"></uni-icons>
				</view> -->
			</view>
			<view class="group_2">
				<view class="lab">{{ '项目名称' }}</view>
				<view class="inp_box">
				<input type="tel" v-model="fuwuData.ProductName" placeholder="请填写"  maxlength="25"/>
				</view>
			</view>
			<view class="group_2">
				<view class="lab">{{ '服务费用/小时' }}</view>
				<view class="inp_box">
				<input type="tel" v-model.number="fuwuData.Price" placeholder="请填写" maxlength="6" />
				</view>
			</view>
			<view class="group_textarea_2">
				<view class="lab">服务说明</view>
				<textarea style="width: 100%;height: 80%; font-weight: 400;margin-top: 20rpx;" :value="fuwuData.Description"
				placeholder="请填写说明" placeholder-class="remtext"  @input.stop="inputrem" />
				<view class="count">{{ fuwuData.Description.length }} / {{ maxCount }}</view>
			</view>
			<view class="Eval" @click.stop="Eval(index)">
				提交
			</view>
			</view>
			</uni-popup>
	</view>
</template>

<script>
import EditorBox from '../teacher/components/editor/editor.vue';
export default {
	components: {
		EditorBox
	},
	data() {
		let d = new Date('1970/1/1');
		console.log(d);
		let nowD = new Date().getTime();
		return {
			//新教练信息
			serverIndex:0,
			newlist:[],
			localList:[],
			// 视频宽高
			vWidth: 520,
			vHight: 450,
			//教练服务
			fuwuData: {
				ProductName: '',
				Price: '',
				Description: '',
				Type: ''
			},
			serverlist:[],
			minDate: d.getTime(),
			maxDate: nowD,
			nowDate: nowD,
			showBirthday:false,
			isConstell:false,
			isSex:false,
			sportList:[],
			maxCount:200,
			//运动项目
			motiontype: [],
			//等级列表
			leveList:[],
			sexList:[['男','女']],
			ConstellList:[['专职','兼职']],
			levelallList:[],
			levelobj:null,
			showmlevel:false,
			showmotion: false,
			address: '',
			formdata: {
				Weight:'', // 体重
				Height:'', // 身高
				Sex:'',// 性别
				Commission: '',//收费标准
				Skills: '', //执教项目
				TrueName: '',
				Resume: '', //教练介绍
				Phone: '', //  联系方式
				PhotoUrl: [], // 头像图片
				ShopID: 0, //所属场地  （非必填）
				Type: '教练',
				Level:'', // 等级
				WorkType:'', // 工作类型
				Birthday:'2000-01-01', // 生日
				ServerItemJSONStr:'', // 服务项目json字段
				City:'', // 城市
			},
			imgArr: [],
			isMore: true,
			searchArr: [],
			searchVal: '',
			PageIndex: 1,
			PageSize: 10,
			ossPath: '',
		};
	},
	computed: {
		canChoose() {
		const list = this.sportList;
		let num = 0;
		for (let i = 0; i < list.length; i++) {
			if (list[i].checked) {
			num++;
			}
		}
		let yesNo = num >= 3 ? false : true;
		return yesNo;
		},
		numChoose() {
		const list = this.sportList;
		let num = 0;
		for (let i = 0; i < list.length; i++) {
			if (list[i].checked) {
			num++;
			}
		}
		return num;
		},
	},
	async onLoad() {
		this.Shoplist();
		this.Getlevel()
		this.getSportType()
		this.ossPath = this.$ossPath
		let dic = await this.$api.post('Catalog/GetDictionary', {
				Type: 'SportType'
			});
			if(dic.code == 0){
				
				let list = []
				for(let i =0;i<dic.data.length;i++){
					list.push(dic.data[i].Code)
				}
				this.motiontype.push(list)
				console.log(this.motiontype);
			}
		this.user = uni.getStorageSync('user');
		this.formdata.Phone = this.user.Phone || ''
	},
	onShow(){
		let that = this;
		uni.$on("getSelectCity", function (data) {
			if (data.name) {
				if (data.name == '全国') {
				that.formdata.City = data.name || that.City;
				} else {
				that.formdata.City = data.name + '市' || that.City;
				}
			}
		});
	},
	onReady() {
		uni.setNavigationBarColor({
			frontColor: '#000000',
			backgroundColor: '#ffffff',
			animation: {
				duration: 400,
				timingFunc: 'easeIn'
			}
		})
	},
	onUnload() {
		uni.$off("getSelectCity");
	 },
	methods: {
		 selectImg_MP(index) {
			let _this = this;
			let ind = 1;
			let enableChooseNum = 9 - _this.localList.length;
			uni.chooseMedia({
				count: enableChooseNum,
				mediaType: ["video"],
				sourceType: ["album", "camera"],
				maxDuration: 30,
				camera: "back",
				success: async (res) => {
				//判断：如果是视频，只取一个视频文件，并提示用户；
				console.log('res',res);
				if (res.tempFiles[0].fileType === "video") {
					let o = {
					duration: res.tempFiles[0].duration,
					fileType: res.tempFiles[0].fileType,
					tempUrl: res.tempFiles[0].thumbTempFilePath,
					// item.
					flieUrl: res.tempFiles[0].tempFilePath,
					tempKey: uni.$u.guid(8),
					pro: 0,
					};
					uni.getVideoInfo({
					src: res.tempFiles[0].thumbTempFilePath,
					success: function (image) {
						console.log("video size  ---" + JSON.stringify(image));

						let max = 560;
						if (image.height > image.width) {
						_this.vHight = max;
						_this.vWidth = max * (image.width / image.height);
						} else {
						max = 600;
						_this.vWidth = max;
						_this.vHight = max * (image.height / image.width);
						}

						_this.reqData.VideoInfo = _this.vWidth + "|" + _this.vHight;

						console.log("video size" + _this.reqData.VideoInfo);
					},
					});
					let con = false
					res.tempFiles.forEach(v=>{
						if(_this.localList.length){
							con = _this.localList.find(item=>item.fileType != v.fileType)							
						}							
					})
					if(con) return _this.$pv.msg('只能同时发布图片或视频')
					// _this.newlist[index].push(o);
					_this.uploading(o.flieUrl, o.tempKey,o.fileType,index);

					return;
				}
				},
			});
			},

	toSelectCity() {
      const hotCitys = "";
      uni.navigateTo({
        url: "/pages/city/cityList",
      });
    },	
		//删除服务
    async DeleteServer(index,i){
        let _this = this
        uni.showModal({
            title: "温馨提示",
            content: '您确定要删除该服务吗？',
            confirmText: "确定",
            success: async function (res) {
                if (res.confirm) {
					_this.newlist[index].ServerListStr.splice(i,1)
                    _this.$pv.msg('删除成功');
                } else if (res.cancel) {
                }
            },
        });
    },
		async Eval() {
			// if(!this.fuwuData.Type){
			// 	this.$pv.msg('请选择运动项目');
			// 	return
			// }
			if (!this.fuwuData.ProductName) {
				this.$pv.msg('请填写项目名称');
				return
			}
			if (!this.fuwuData.Price) {
				this.$pv.msg('请填写费用');
				return
			}
			if (!Number(this.fuwuData.Price)) {
				this.$pv.msg('请填写正确的数字');
				return
			}
			if (this.fuwuData.Price < 0) {
				this.$pv.msg('请填写费用必须大于0');
				return
			}
			if (!this.fuwuData.Description) {
				this.$pv.msg('请填写说明');
				return
			}
			let data = JSON.parse(JSON.stringify(this.fuwuData))
			let disString = this.$util.utf16ToEntities(data.Description)
			let proString = this.$util.utf16ToEntities(data.ProductName)
			let priceString = String(data.Price)
			data.Description = disString
			data.ProductName = proString
			data.Price = priceString
			for (let i = 0; i < this.sportList.length; i++) {
					if(this.sportList[i].Code == this.fuwuData.Type){
						data.Images = this.sportList[i].ValueStr
					}
			}
			let _this = this
			uni.showModal({
				title: "温馨提示",
				content: '您确定要添加该服务吗？',
				confirmText: "确定",
				success: async function (res) {
				if (res.confirm) {
						_this.newlist[_this.serverIndex].ServerListStr.push(data)
						_this.$pv.msg('添加成功');
						_this.fuwuData.ProductName = '',
						_this.fuwuData.Type = ''
						_this.fuwuData.Price = '',
						_this.fuwuData.Description = ''
						_this.$refs["serveBox"].close();
				} else if (res.cancel) {
				}
				},
			});
			console.log(this.ServerListStr,'2222');
		},
		openServeBox(index){
			this.$refs["serveBox"].open();
			this.serverIndex = index
			this.fuwuData.Type = this.newlist[index].Code
		},
		async setBirthday(e) {
			console.log(e.value);
			this.formdata.Birthday = await uni.$u.date(e.value, 'yyyy-mm-dd');
			this.showBirthday = false;
		},

		skitype(Code, checked) {
			this.newlist = []
			let list = this.sportList;
			let listtrue = []
			const maxNum = 3;
			if (!checked && !this.canChoose) {
				this.$pv.msg("最多选" + maxNum + "个标签");
				return;
			}
			for (let i = 0; i < list.length; i++) {
				list[i].checked =
				list[i].Code == Code ? !list[i].checked : list[i].checked;
				if(list[i].checked){
					listtrue.push(list[i].Code)
				}
			}
			console.log(listtrue);
			for (let i = 0; i < listtrue.length; i++) {
					this.newlist.push({
						Code:listtrue[i],
						Video:'',
						Imglist:[],
						ServerListStr:[],
					})
			}
			this.formdata.Skills = listtrue.join(',')
		},
		async getSportType() {
			let res = await this.$api.post("Catalog/GetDictionary", {
				Type: "SportType",
			});
			if (res.code == 0) {
				this.sportList = res.data;
				for (let i = 0; i < this.sportList.length; i++) {
					this.$set(
						this.sportList[i],
						"checked",
						false
					);
				}
			}
		},
		isskill() {
			this.$refs["gift"].open();
		},
		async Getlevel(){
			let res = await this.$api.post('Catalog/GetDictionary', {
				Type: 'Level'
			});
			if(res.code == 0){
				this.levelallList = res.data
				let list = []
				for(let i =0;i<res.data.length;i++){
					list.push(res.data[i].Code)
				}
				this.leveList.push(list)
			}
			
		},
		getNums(e) {
				let _this = this;

				uni.login({
					provider: 'weixin',
					success: async res => {
						let d = {
							encryptedData: e.detail.encryptedData,
							code: res.code,
							aesIv: e.detail.iv
						}
						let res3 = await _this.$api.post('User/GetPhoneNumber', d);

						_this.formdata.Phone = res3.data;

					},
					fail: err => {
						uni.showModal({
							content: '获取失败',
							showCancel: false
						});
					}
				});

			},
		inputrem(e){
			// console.log(e);
			const {value,cursor} = e.detail
			if (cursor>200) {
				this.fuwuData.Description = value.slice(0,200)
			}else{
				this.fuwuData.Description = value
			}
			
			// this.reqData.Remark
		},
			//选择地址
		openMap(item) {
			const _this = this
			 	uni.chooseLocation({
					async success(res) {
						// console.log('res-------',res);
						let d = await _this.$util.getAddress({ longitude: res.longitude, latitude: res.latitude });
						// _this.reqData.Latitude = res.latitude
						// _this.reqData.Longitude = res.longitude
						_this.address = res.name || d.result.address_reference.landmark_l2.title
						// _this.formdata.ShopID = res.name || d.result.address_reference.landmark_l2.title
					}
				});
		},
		setmotion(e) {
			this.fuwuData.ProductName = e.value[0];
			this.fuwuData.Type = e.value[0];
			this.showmotion = false;
		},
		setlevel(e){
			this.formdata.Level = e.value[0];
			this.levelobj = this.levelallList.filter((item,index)=>{
				return item.Code == e.value[0]
			})
			this.showmlevel = false;
		},
		//性别选择
		setSex(e){
			this.formdata.Sex = e.value[0];
			this.isSex = false;
		},
		//工作选择
		setConstell(e){
			this.formdata.WorkType = e.value[0];
			this.isConstell = false;
		},
		async Shoplist() {
			let res = await this.$api.post('/Shops/Search', { ShopName: this.searchVal, PageIndex: this.PageIndex, PageSize: 10 });
			this.isMore = Array.isArray(res.data) && res.data.length >= this.PageSize;
			this.searchArr = this.searchArr.concat(res.data)
		},
		scrolltolower() {
			if (this.isMore) {
				this.PageIndex++
				this.Shoplist()
			}
		},
		tapShop(item) {
			console.log(item);
			this.address = `【${item.City}】${item.ShopName}`
			this.formdata.ShopID = item.ID
			this.$refs.popup.close()
		},
		clearSearch() {
			this.PageIndex = 1
			this.searchVal = ''
			this.searchArr = []
			this.Shoplist()
		},
		searchFun(e) {
			this.$util.throttle(() => {
				this.PageIndex = 1
				this.searchArr = []
				this.Shoplist()
			})
		},
		// 文件上传
		async uploading(url, tempKey,fileType='image',index) {
			console.log('url ----------' + url);

			const r = await this.$upload(url, (pro) => {
				this.imgArr.forEach(async (item) => {
					if (item.tempKey == tempKey) {
						item.pro =  await pro;
					}
				});
			});
			this.imgArr.forEach((item) => {
				if (item.tempKey == tempKey) {
					item.netPath = r;
				}
			});

			console.log('upload file ' + r);
			if(fileType !='image'){
				this.newlist[index].Video = r
			}else{
				this.newlist[index].Imglist.push(r)
			}
			// this.formdata.PhotoUrl.push(r);

			// this.formdata.PhotoUrl = r
		},
		upload(index) {
			let _this = this;
			uni.chooseMedia({
				count: 9,
				mediaType: ['image'],
				sourceType: ['album', 'camera'],
				maxDuration: 30,
				camera: 'back',
				success(res) {
					console.log(res);
					res.tempFiles.forEach(async (item) => {
						let o = {
							duration: 0,
							fileType: item.fileType,
							tempUrl: item.tempFilePath,
							flieUrl: item.tempFilePath,
							tempKey: uni.$u.guid(8),
							pro: 0,
						};

						// _this.imgArr.push(o);

						let rex = await _this.uploading(o.flieUrl, o.tempKey,o.fileType,index);
						console.log('rex-------', rex);
					});
				},
			});
		},
		selectImg_APP() {
			let _this = this;
			uni.showActionSheet({
				itemList: ['选择照片', '取消'],
				success: function (res) {
					if (res.tapIndex == 0) {
						let ind = 1;
						uni.chooseImage({
							// count:  允许上传的照片数量
							count: 9,
							// sizeType:  original 原图，compressed 压缩图，默认二者都有
							sizeType: ['original', 'compressed'],
							sourceType: ['album'],
							success(res) {
								console.log(res);
								res.tempFiles.forEach(async (item) => {
									let o = {
										duration: 0,
										fileType: 'image',
										tempUrl: item.path,
										flieUrl: item.path,
										tempKey: uni.$u.guid(8),
										pro: 0,
									};

									_this.imgArr.push(o);

									let rex = await _this.uploading(o.flieUrl, o.tempKey);
								});
							},
						});
						return;
					}
				},
				fail: function (res) { },
			});
		},
		delImg(index,i) {
			this.imgArr.splice(i, 1);
			this.newlist[index].Imglist.splice(i, 1);
		},
		delvideo(i){
			this.newlist[i].Video = '';
		},
		judGment(){
			let con = this.formdata;
			let _this =this
			if (!con.TrueName) {
				this.$pv.msg('请填写教练姓名');
				return;
			}
			// if (!con.Resume) {
			// 	this.$pv.msg('请填写教练介绍');
			// 	return;
			// }
			// if(con.PhotoUrl.length == 0){
			// 	this.$pv.msg('请选择图片');
			// 	return;
			// }
			// if(con.PhotoUrl.length < 3){
			// 	this.$pv.msg('请至少选择三张图片');
			// 	return;
			// }
			if (!con.Phone) {
				this.$pv.msg('请填写联系电话');
				return;
			}
			if(con.Phone.length != 11 && !Number(con.Phone)){
				this.$pv.msg('请填写正确的电话号码');
				return;
			}
			if(!con.Skills){
				this.$pv.msg('请选择擅长项目');
				return 
			}
			if(!con.Level){
				this.$pv.msg('请选择等级');
				return 
			}
			// if(!con.ShopID){
			// 	this.$pv.msg('请选择常驻场地');
			// 	return 
			// }
			if(!con.Birthday){
				this.$pv.msg('请选择生日');
				return 
			}
			if(!con.Sex){
				this.$pv.msg('请选择性别');
				return 
			}
			if(!con.WorkType){
				this.$pv.msg('请选择工作类型');
				return 
			}
			// if(this.serverlist.length == 0){
			// 	this.$pv.msg('请至少添一个服务项目');
			// 	return 
			// }
			if(!con.Weight || !con.Height){
				uni.showModal({
				title: "温馨提示",
				content: '完善身高体重更具优势哦~',
				confirmText: "去填写",
          		cancelText: "残忍拒绝",
				success: async function (res) {
					 if (res.confirm) {
							return
						} else if (res.cancel) {
							_this.send()
						}
				},
			});
			}
			if (con.Weight && con.Height) {
				this.send()
			}
		},
		async send() {
			// this.formdata.Resume = this.formdata.PhotoUrl.join(',');
			this.formdata.PhotoUrl=uni.getStorageSync('user').HeadImgUrl
			// let serverimg = JSON.parse(JSON.stringify(this.serverlist))
			// for (let i = 0; i < serverimg.length; i++) {
			// 	delete serverimg[i].Images
			// }
			// this.formdata.ServerItemJSONStr=JSON.stringify(serverimg) 
			let dataList = JSON.parse(JSON.stringify(this.newlist))
			for (let i = 0; i < dataList.length; i++) {
				dataList[i].Imglist = dataList[i].Imglist.join(',')
				dataList[i].ServerListStr = JSON.stringify(dataList[i].ServerListStr)
			}
			this.formdata.ServerItemJSONStr=JSON.stringify(dataList)
			console.log(this.newlist,'newlistnewlist');
			let res = await this.$api.post('/Technicians/Apply', {
				...this.formdata
				
				});
			if (res.code == 0) {
				this.$pv.msg('申请成功');
				setTimeout(()=>{
					this.redirect_to('/pages/user/real_result')
				},500)
				
			}else{
				this.$pv.msg(res.message)
			}
		},
	},
};
</script>

<style lang="scss">
page {
	background-color: #F6F6F6;
}
.skname{
	font-size: 32rpx;
    font-weight: bold;
    margin-bottom: 15rpx;
}

.skillbox{
			    display: flex;
				margin-top: 20rpx;
				align-items: baseline;
				.check_content{
					flex: 1;
					>input{
						text-align: right;
						border-bottom: 0;
					}
				}
				.addserve{
					background-color: #706EEE;
					width: 130rpx;
					height: 60rpx;
					border-radius: 30rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					color: #fff;
					margin-left: auto;
				}
		}

.video_box {
  margin-top: 20rpx;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  background: #202020;
  display: flex;
  justify-content: center;
  border-radius: 16rpx;
  overflow: hidden;

  .pro {
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
    text-align: center;
    color: #888;
  }

  .del_con {
    position: absolute;
    top: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.4);
    height: 40rpx;
    width: 40rpx;
    text-align: center;
    line-height: 40rpx;
    border-radius: 0 16rpx 0 16rpx;
  }
}


view,
text {
	box-sizing: border-box;
}
.Eval {
  width: 400rpx;
  height: 88rpx;
  background: #706EEE;
  border-radius: 44rpx;
  text-align: center;
  line-height: 88rpx;
  color: #fff;
  font-size: 32rpx;
  font-weight: bold;
  margin: 20rpx auto;
}
.group_textarea_2 {
  height: 264rpx;
  margin-top: 30rpx;
  // background-color: #fff;
  // padding-left: 32rpx;
  // text-indent: 2em;
  box-sizing: border-box;
  position: relative;

  .lab {
    padding-right: 10rpx;
    color: #333333;
    font-size: 32rpx;
    font-weight: 500;
  }

  .count {
    position: absolute;
    bottom: 15rpx;
    right: 15rpx;
    font-size: 24rpx;
    color: #C2C2C2;
  }

  /deep/ .u-textarea {
    background: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-bottom: none !important;
    padding: 0 !important;
    height: 100% !important;
    text-indent: 2em;
  }

  /deep/ .u-textarea__count {
    background: none !important;
    color: #0d0d0d !important;
  }

  /deep/ .u-textarea__field {
    color: #0d0d0d !important;
    font-size: 28rpx !important;
    height: 100% !important;
  }
}
.group_2 {
  display: flex;
  align-items: center;
  height: 104rpx;
  border-bottom: 1rpx solid #E4E4E4;

  &:last-child {
    border-bottom: none;
  }

  .text5 {
    font-size: 28rpx;
    font-weight: 500;
    color: #333333;
  }

  .text6 {
    font-size: 28rpx;
    font-weight: 500;
    color: #C2C2C2;
  }

  .unit {
    color: #333333;
    font-weight: 500;
    font-size: 28rpx;
    padding-right: 10rpx;
    margin-right: 10rpx;
  }

  .lab {
    padding-right: 10rpx;
    color: #333333;
    font-size: 32rpx;
    font-weight: 500;
  }

  .inp_box {
    flex: 1;

    input {
      width: 100%;
      color: #333333;
      text-align: right;
      font-weight: 500;
    }
  }

  .icon_box {
    height: 40rpx;
    width: 40rpx;
    line-height: 40rpx;
  }
}
.bottombox {
  width: 96vw;
  margin:0 auto;
  background-color: #fff;
  padding: 0 32rpx 30rpx 34rpx;
  box-sizing: border-box;
  height: fit-content;
  border-radius: 18rpx;
}

.bottombox .group:last-child {
  border-bottom: none;
}

.s_btn {
	color: #fff;
	font-size: 24rpx;
	width: 124rpx !important;
	height: 60rpx !important;
	border-radius: 5rpx;
	background-color: #706EEE;
	margin: 0 0 0 20rpx;
}
.remtext{
	font-size: 28rpx !important;
	color: #C2C2C2 !important;
	font-weight: 500 !important;
}
.group_textarea{
	height: 264rpx;
	margin-top: 30rpx;
	// background-color: #fff;
	// padding-left: 32rpx;
    box-sizing: border-box;
	position: relative;
	.count{
		position: absolute;
		bottom: 20rpx;
		right: 33rpx;
		font-size: 28rpx;
		color: #C2C2C2;
	}
	/deep/ .u-textarea {
		background: none !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		border-bottom: none !important;
		padding: 0 !important;
		height: 100% !important;
	}

	/deep/ .u-textarea__count {
		background: none !important;
		color: #0d0d0d !important;
	}

	/deep/ .u-textarea__field {
		color: #0d0d0d !important;
		font-size: 28rpx !important; 
		height: 100% !important;
	}
}
.gary {
	color: #999999 !important;
	font-size: 32rpx;
	margin-right: 7rpx;
}

image {
	width: 100%;
	height: 100%;
}

.group {
	border-bottom: 1px solid #e4e4e4;

	.lab {
		padding-right: 10rpx;
		color: black;
		font-size: 32rpx;
	}

	.inp_box {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		justify-content: flex-end;

		>view {
			display: flex;
		}

		.total_reward {
			font-size: 28rpx;
			color: rgb(156, 156, 156);
			margin-top: 16rpx;
		}
	}

	.uni_icon {
		width: 40rpx;
		height: 40rpx;
	}
}

.fillet {
	border-radius: 16rpx;
	background-color: #fff;
	box-sizing: border-box;
}

.placeholderStyle {
	color: #C2C2C2;
	font-size: 32rpx;
	font-weight: 500;
}

.warp {

	// padding: 16rpx;
	.img_list {
		padding-top: 30rpx;
		border-top: 1rpx solid #E4E4E4;
		box-sizing: border-box;
		margin-bottom: 30rpx;
		// padding: 26rpx 32rpx;
		.title {
			font-size: 30rpx;
		}

		image {
			width: 100%;
			height: 100%;
		}

		.img_box {
			display: flex;
			align-items: center;
			// justify-content: space-evenly;
			flex-wrap: wrap;
		}

		.videobox {
			padding: 32rpx;
			position: relative;

			>view {
				width: 100%;
				height: 300rpx;
				border-radius: 16rpx;
				overflow: hidden;

				video {
					width: 100%;
					height: 100%;
				}
			}

			.icon {
				position: absolute;
				right: 10rpx;
				top: 10rpx;
				width: 50rpx;
				height: 50rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				// border-radius: 50%;
				z-index: 10;

				image {
					width: 40rpx;
					height: 40rpx;
					background: #fff;
					border-radius: 50%;
				}
			}
		}

		.img {
			width: 200rpx;
			height: 200rpx;
			border-radius: 8rpx;
			margin-right: 16rpx;
			margin-top: 16rpx;
			// overflow: hidden;
			position: relative;

			image {
				border-radius: 8rpx;
			}

			.icon {
				position: absolute;
				right: -20rpx;
				top: -14rpx;
				width: 50rpx;
				height: 50rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				// border-radius: 50%;
				z-index: 10;

				image {
					width: 40rpx;
					height: 40rpx;
					background: #fff;
					border-radius: 50%;
				}
			}
		}

		.img:nth-child(3n) {
			margin-right: 0;
		}

		.addimg {
			display: flex;
			align-items: center;
			justify-content: center;
			background-color: #F6F6F6;

			image {
				width: 80rpx;
				height: 80rpx;
			}
		}
	}

	.textbox {
		margin-top: 16rpx;
		padding: 32rpx;
		box-sizing: border-box;

		.tit_box {
			margin-bottom: 20rpx;
		}

		input {
			font-weight: bold;
			padding-bottom: 20rpx;
			border-bottom: 1rpx solid #E4E4E4;
		}

		input:nth-child(2) {
			margin-top: 20rpx;
		}

		textarea {
			width: 100%;
			height: 150rpx;
			margin: 20rpx 0;
			font-size: 26rpx;
			line-height: 1.6;
		}
	}

	.checkbox {
		margin-top: 30rpx;
		padding: 0 32rpx;
		.leveltext{
			color: #fc4f45;
			font-size: 24rpx;
			border-bottom: 1rpx solid #E4E4E4;
			padding-bottom: 14rpx;
		}
		.check_item {
			border-bottom: 1rpx solid #E4E4E4;
			display: flex;
			align-items: center;
			justify-content: space-between;
			.addserve{
				background-color: #706EEE;
				width: 130rpx;
				height: 60rpx;
				border-radius: 30rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #fff;
			}
			.check_content {
				display: flex;
				align-items: center;
				justify-content: flex-end;
				padding: 26rpx 0;
				// width: 65%;
				flex: 1;

				input {
					font-size: 32rpx !important;
					width: 100%;
					text-align: right;
				}

				// .input-placeholder {
				// 	font-size: 26rpx !important;
				// }

				.cheStyle {
					font-size: 32rpx !important;
					color: #999999 !important;
				}

				.lit {
					width: 100%;
					text-align: right;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
				}

				.inp_box {
					display: flex;
					align-items: center;
					flex-wrap: wrap;
					justify-content: flex-end;

					/deep/ .u-radio-group {
						.u-radio {
							margin-left: 20rpx;
						}

						text {
							font-size: 28rpx !important;
						}
					}

					>view {
						display: flex;
					}

					.total_reward {
						font-size: 28rpx;
						color: rgb(156, 156, 156);
						margin-top: 16rpx;
					}
				}
			}
		}

		.check_item:last-child {
			border: 0;
		}
	}

	.check_wap {
		border-top-left-radius: 24rpx;
		border-top-right-radius: 24rpx;
		background-color: #2c2c2c;
		padding: 26rpx;
		padding-bottom: 40rpx;

		view {
			font-size: 28rpx;
		}

		.check_tab {
			margin-top: -10rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding-bottom: 2rpx;
			border-bottom: 2rpx solid #404040;

			.nav {
				display: flex;
				align-items: center;
				flex: 0.9;

				.nav_text {
					padding: 10rpx 24rpx;
				}

				.nav_text:first-child {
					padding-left: 0;
				}
			}

			.nav_active {
				color: #e0c48e;
				position: relative;

				&::after {
					content: '';
					position: absolute;
					bottom: -6rpx;
					left: 50%;
					transform: translate(-50%, -50%);
					width: 30%;
					height: 6rpx;
					border-radius: 24rpx;
					background-color: #e0c48e;
				}
			}

			.tit {
				font-size: 32rpx;
				color: #fff;
				justify-content: center;
			}

			.close {
				padding: 10rpx;
				display: flex;
				align-items: center;

				image {
					width: 44rpx;
					height: 44rpx;
				}
			}
		}

		.picker_view {
			width: 100%;
			margin: 20rpx 0;
			height: 500rpx;
			overflow: hidden;

			.picker_colum {
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.border {
				border-top: 2rpx solid #717171;
				border-bottom: 2rpx solid #717171;
			}
		}

		.maskclass {
			background: none;
		}

		.picker_btn {
			border-radius: 50rpx;
			font-size: 30rpx;
			color: #4c310c;
			padding: 20rpx 0;
			margin-bottom: 20rpx;
			text-align: center;
			background-image: linear-gradient(to right, #fef0bc, #b98b51);
		}
	}

	.btn_box {
		// background-color: #262626;
		position: fixed;
		width: 100%;
		box-sizing: border-box;
		bottom: 0;
		left: 0;
		padding: 20rpx 26rpx;
		padding-bottom: 40rpx;
		background-color: #fff;
		z-index: 9;

		.go_btn {
			color: #fff;
			border-radius: 50rpx;
			font-size: 32rpx;
			color: #fff;
			padding: 20rpx 0;
			text-align: center;
			background-color: #706EEE;
		}
	}
}

.popupbox {
	// background-color: #2c2c2c;
	background-color: #fff;
	border-top-left-radius: 26rpx;
	border-top-right-radius: 26rpx;
	padding: 20rpx 32rpx;
	padding-bottom: 70rpx;

	view {
		color: #111;
	}

	.title {
		color: #111;
		font-size: 32rpx;
		font-weight: bold;
		margin-bottom: 24rpx;
	}

	.sear {
		display: flex;
		align-items: center;
		margin-bottom: 20rpx;
		// background-color: #fff;
		border-radius: 46rpx;
		box-shadow: 0 0 8rpx #ccc;

		.searStyle {
			font-size: 32rpx;
			color: red;
		}

		.icon {
			padding: 10rpx 20rpx;
			display: flex;
			align-items: center;
			justify-content: center;

			image {
				width: 34rpx;
				height: 34rpx;
			}
		}

		input {
			padding: 10rpx 0;
			flex: 1;
		}
	}

	.scroll {
		width: 100%;
		height: 30vh;
		box-sizing: border-box;

		.item {
			padding: 20rpx 0;
			text-align: center;
			border-bottom: 2rpx solid #eee;
			overflow: hidden;
			/*超出部分隐藏*/
			white-space: nowrap;
			/*禁止换行*/
			text-overflow: ellipsis;
			/*省略号*/

		}

		.item:last-child {
			border: 0;
		}

		.item:first-child {
			padding-top: 0;
		}
	}
}
.sporttext {
  font-size: 36rpx;
  color: #0d0d0d;
  font-weight: bold;
  padding-left: 84rpx;
  padding-top: 35rpx;
  background: white;
  border-radius: 18rpx 18rpx 0 0;
  .maxtag{
	font-size: 28rpx;
	font-weight: bold;
	color: #333333;
  }
}
.sportbox {
  width: 700rpx;
  padding: 58rpx;
  background: white;
  border-radius: 0 0 18rpx 18rpx;
  display: flex;
  flex-wrap: wrap;
  .sport {
    width: 152rpx;
    height: 72rpx;
    border-radius: 8rpx;
    background-color: #f7f7f7;
    text-align: center;
    line-height: 72rpx;
    color: #333333;
    font-size: 28rpx;
    margin-left: 24rpx;
    margin-bottom: 24rpx;
  }
  .text4 {
    color: #fff !important;
    background-color: #706eee !important;
  }
}

  .contentbox {
    display: flex;
    align-items: center;
    padding: 32rpx;
    box-sizing: border-box;
    margin-bottom: 24rpx;
    border-radius: 16rpx;
    background: #FFFFFF;
    box-shadow: 0rpx 0rpx 16rpx 0rpx rgba(0, 0, 0, 0.08);
    margin-top: 32rpx;
    .icon {
      width: 112rpx;
      min-width: 112rpx;
      height: 112rpx;
    //   background-color: yellowgreen;
      margin-right: 32rpx;
      border-radius: 18rpx;
    }

    .titlebox {
      margin-right: auto;

      .title {
        font-size: 32rpx;
        font-weight: bold;
        color: #333333;
      }

      .fee {
        font-size: 32rpx;
        font-weight: 500;
        color: #FC201C;
        margin-top: 12rpx;
      }
    }

    .reservabtn {
      width: 182rpx;
      min-width: 182rpx;
      height: 64rpx;
      background: #706EEE;
      border-radius: 32rpx;
      text-align: center;
      line-height: 64rpx;
      color: #fff;
      font-size: 28rpx;
    }
  }
</style>
